<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>项目管理平台</title>
<style>
	@media (min-width:0px) and (max-width:992px) {
		.cls{
			font-size:32pt;
			margin-top:20px;
		}
		.ta1{
			width:100%;
			height:480px;
		}
		.ta2{
			width:100%;
			height:960px;
		}
		.search{
			width:100%;
		}
	}
	@media (min-width:992px) {
		.cls{
			width:auto;
		}
		.ta1{
			width:100%;
			height:200px;
		}
		.ta2{
			width:100%;
			height:400px;
		}
		.search{
			width:auto;
		}
	}
</style>
</head>
<body class="cls">
<select id="projects" class="cls"></select>
<select id="type" class="cls" onchange="getBugList(1)">
	<option>指派给我</option>
	<option>由我创建</option>
	<option>由我解决</option>
	<option>未解决</option>
	<option>待关闭</option>
	<option>未关闭</option>
	<option>所有</option>
</select>
<input type="search" id="search" placeholder="搜索" class="cls search" onkeydown="if(event.keyCode==13)getBugList(1)"></input>
<button id="page" class="cls" onclick="getBugList()">第1/1页</button>
<button id="last" class="cls" onclick="getBugList(page-1)">上一页</button>
<button id="next" class="cls" onclick="getBugList(page+1)">下一页</button>
<button class="cls" onclick="dynamicShow()">动态</button>
<button class="cls" onclick="createShow()">创建</button>
<p>
<table id="list" border="1">
<tr>
	<th style="width:420px">标题</th>
	<th style="width:110px">状态</th>
	<th style="width:50px">优先级</th>
	<th style="width:70px">当前指派</th>
	<th style="width:50px">创建者</th>
	<th style="width:160px">创建时间</th>
	<th style="width:230px">操作</th>
</tr>
</table>
<dialog id="create" style="width:80%">
	<div style="float:right"><button class="cls" onclick="document.getElementById('create').close()">关闭</button></div>
	<div id="create_title_r"></div><p>
	指派给<select id="create_assign" class="cls"></select>
	优先级<select id="create_priority" class="cls">
		<option>1</option>
		<option>2</option>
		<option>3</option>
	</select><p>
	标题<input id="create_title" type="text" class="cls" style="width:100%"></input><p>
	内容<textarea id="create_content" class="cls ta1"></textarea><p>
	<div style="text-align:center"><button class="cls" onclick="createSubmit()">确定</button></div>
</dialog>
<dialog id="view" style="width:80%">
	<div style="float:right"><button class="cls" onclick="document.getElementById('view').close()">关闭</button></div>
	<div id="view_title"></div><p>
	<div><textarea id="view_content" readonly="readonly" class="cls ta1"></textarea></div>
	<div><textarea id="view_history" readonly="readonly" class="cls ta1"></textarea></div>
</dialog>
<dialog id="dynamic" style="width:80%">
	<div style="float:right"><button class="cls" onclick="document.getElementById('dynamic').close()">关闭</button></div>
	<div id="dynamic_title"></div><p>
	<div><textarea id="dynamic_content" readonly="readonly" class="cls ta2"></textarea></div>
</dialog>
<dialog id="edit" style="width:80%">
	<div style="float:right"><button class="cls" onclick="document.getElementById('edit').close()">关闭</button></div>
	<div id="edit_title_r"></div><p>
	优先级<select id="edit_priority" class="cls">
		<option>1</option>
		<option>2</option>
		<option>3</option>
	</select><p>
	标题<input id="edit_title" type="text" class="cls" style="width:100%"></input><p>
	内容<textarea id="edit_content" class="cls ta1"></textarea><p>
	备注<textarea id="edit_comment" class="cls ta1"></textarea>
	<div style="text-align:center"><button class="cls" onclick="editSubmit()">确定</button></div>
</dialog>
<dialog id="assign" style="width:80%">
	<div style="float:right"><button class='cls' onclick="document.getElementById('assign').close()">关闭</button></div>
	<div id="assign_title"></div><p>
	指派给<select id="assign_assign" class='cls'></select><p>
	备注<textarea id="assign_comment" class='cls ta1'></textarea>
	<div style="text-align:center"><button class='cls' onclick="assignSubmit()">确定</button></div>
</dialog>
<dialog id="resolve" style="width:80%">
	<div style="float:right"><button class="cls" onclick="document.getElementById('resolve').close()">关闭</button></div>
	<div id="resolve_title"></div><p>
	指派给<select id="resolve_assign" class="cls"></select>
	解决方案<select id="resolve_type" class="cls"></select><p>
	备注<textarea id="resolve_comment" class="cls ta1"></textarea>
	<div style="text-align:center"><button class="cls" onclick="resolveSubmit()">确定</button></div>
</dialog>
<dialog id="close" style="width:80%">
	<div style="float:right"><button class="cls" onclick="document.getElementById('close').close()">关闭</button></div>
	<div id="close_title"></div><p>
	备注<textarea id="close_comment" class="cls ta1"></textarea>
	<div style="text-align:center"><button class="cls" onclick="closeSubmit()">确定</button></div>
</dialog>
<script type="text/javascript">
var users=new Object();
var projects=new Object();
var bugs,token,page,total,curid,isActivate;
var stateNames=["已关闭","激活","已修复","设计如此","无法重现","无需处理"];
var actionNames=["创建","编辑","备注","指派给","激活","关闭","解决（已修复）","解决（设计如此）","解决（无法重现）","解决（无需处理）"];
function backLogin(){
	window.location.href="/login.html";
}
function getBugList(p=page){
	let url="bug?utf8&project="+document.getElementById("projects").value+"&type="+document.getElementById("type").selectedIndex+"&page="+p+"&token="+token;
	let search=document.getElementById("search").value;
	if(search.length>0)
		url+="&search="+search;
	let xhr= new XMLHttpRequest();
	xhr.open('GET',url,true);
	xhr.send(null);
	xhr.onreadystatechange=function(){
		if(xhr.readyState!=4 || xhr.status!=200)
			return;
		let data=xhr.responseText;
		if(data.length==0)
			return backLogin();
		jsbugs=window.JSON.parse(data);
		page=jsbugs.page;
		total=jsbugs.total;
		document.getElementById("page").innerHTML="第"+page+"/"+total+"页";
		document.getElementById("last").disabled=page<2;
		document.getElementById("next").disabled=page>=total;
		let list=document.getElementById("list");
		for(let i=list.rows.length-1;i>0;--i){
			list.rows[i].remove();
		}
		bugs=new Object();
		jsbugs.bugs.forEach(element=>{
			bugs[element.id]=element;
			let row=list.insertRow();
			row.insertCell(0).innerHTML=element.title;
			let state=element.state;
			let stateStr;
			if(state==2)
				stateStr=stateNames[state]+"("+getUserName(element.resolver)+")";
			else
				stateStr=stateNames[state];
			row.insertCell(1).innerHTML=stateStr;
			row.insertCell(2).innerHTML=element.priority;
			row.insertCell(3).innerHTML=getUserName(element.assignee);
			row.insertCell(4).innerHTML=getUserName(element.creater);
			row.insertCell(5).innerHTML=element.time;
			let handle=row.insertCell(6);
			handle.innerHTML=
			"<button class='cls' onclick='viewShow("+element.id+")'>查看</button> \
			<button class='cls' onclick='editShow("+element.id+")'>编辑</button>";
			if(state==1){
				handle.innerHTML+="<button class='cls' onclick='assignShow("+element.id+",false)'>指派</button> \
				<button class='cls' onclick='resolveShow("+element.id+")'>解决</button>";
			}else if(state>1){
				handle.innerHTML+="<button class='cls' onclick='assignShow("+element.id+",false)'>指派</button> \
				<button class='cls' onclick='assignShow("+element.id+",true)'>激活</button> \
				<button class='cls' onclick='closeShow("+element.id+")'>关闭</button>";
			}else if(state==0){
				handle.innerHTML+="<button class='cls' onclick='assignShow("+element.id+",true)'>激活</button>";
			}
				
		});
	};
}
function createShow(){
	let projects=document.getElementById("projects");
	document.getElementById("create_title_r").innerHTML="创建："+projects.options[projects.selectedIndex].text;
	document.getElementById("create_assign").selectedIndex=-1;
	document.getElementById("create_priority").selectedIndex=1;
	document.getElementById("create_title").value="";
	document.getElementById("create_content").value="";
	document.getElementById("create").showModal();
}
function createSubmit(){
	let assign=document.getElementById("create_assign");
	if(assign.selectedIndex<0){
		alert("请选择指派目标");
		return;
	}
	let title=document.getElementById("create_title").value;
	if(title.length==0){
		alert("标题不能为空");
		return;
	}
	let content=document.getElementById("create_content").value;
	let priority=document.getElementById("create_priority").selectedIndex+1;
	let xhr= new XMLHttpRequest();
	xhr.open('POST',"create?utf8",true);
	let url="project="+document.getElementById("projects").value+"&title="+encodeURI(title)+"&content="+encodeURI(content)
		+"&assign="+assign.value+"&priority="+priority+"&token="+token;
	xhr.send(url);
	xhr.onreadystatechange=function(){
		if(xhr.readyState!=4 || xhr.status!=200)
			return;
		let data=xhr.responseText;
		if(data.length==0)
			return backLogin();
		document.getElementById("create").close();
		getBugList();
	};
}
function viewShow(id){
	document.getElementById("view_title").innerHTML="查看："+bugs[id].title;
	document.getElementById("view_content").innerHTML=bugs[id].content;
	let xhr= new XMLHttpRequest();
	xhr.open('GET',"view?utf8&bug="+id+"&token="+token,true);
	xhr.send(null);
	xhr.onreadystatechange=function(){
		if(xhr.readyState!=4 || xhr.status!=200)
			return;
		let data=xhr.responseText;
		if(data.length==0)
			return backLogin();
		jshistorys=window.JSON.parse(data);
		let str="";
		jshistorys.historys.forEach(element=>{
			str+=element.time+" "+getUserName(element.user)+actionNames[element.type];
			if(element.assignee.length>0){
				if(element.type==1){
					str+="，优先级改为"+element.assignee;
				}else{
					if(element.type!=3){
						str+="，指派给";
					}
					str+=getUserName(element.assignee);
				}
			}
			if(element.comment_title.length>0){
				if(element.type==0){
					str+="，优先级";
				}else{
					if(element.type!=2){
						str+="，备注：";
					}else{
						str+="：";
					}
					str+="\n";
				}
				str+=element.comment_title;
			}
			str+="\n";
		});
		document.getElementById("view_history").innerHTML=str;
		document.getElementById("view").showModal();
	};
}
function dynamicShow(){
	let projects=document.getElementById("projects");
	document.getElementById("dynamic_title").innerHTML="动态："+projects.options[projects.selectedIndex].text;
	let xhr= new XMLHttpRequest();
	xhr.open('GET',"dynamic?utf8&project="+projects.value+"&token="+token,true);
	xhr.send(null);
	xhr.onreadystatechange=function(){
		if(xhr.readyState!=4 || xhr.status!=200)
			return;
		let data=xhr.responseText;
		if(data.length==0)
			return backLogin();
		jshistorys=window.JSON.parse(data);
		let str="";
		jshistorys.historys.forEach(element=>{
			str+=element.time+" "+getUserName(element.user);
			if(element.type==3){
				str+="将";
			}else{
				str+=actionNames[element.type];
			}
			str+="\""+element.comment_title+"\"";
			if(element.assignee.length>0){
				if(element.type==1){
					str+="，优先级改为"+element.assignee;
				}else{
					if(element.type!=3)
						str+="，";
					str+="指派给"+getUserName(element.assignee);
				}
			}
			str+="\n";
		});
		document.getElementById("dynamic_content").innerHTML=str;
		document.getElementById("dynamic").showModal();
	};
}
function editShow(id){
	curid=id;
	document.getElementById("edit_title_r").innerHTML="编辑："+bugs[id].title;
	document.getElementById("edit_title").value=bugs[id].title;
	document.getElementById("edit_content").value=bugs[id].content;
	document.getElementById("edit_comment").value="";
	document.getElementById("edit_priority").selectedIndex=bugs[id].priority-1;
	document.getElementById("edit").showModal();
}
function editSubmit(){
	let title=document.getElementById("edit_title").value;
	let content=document.getElementById("edit_content").value;
	let comment=document.getElementById("edit_comment").value;
	let priority=document.getElementById("edit_priority").selectedIndex+1;
	if(title.length==0){
		alert("标题不能为空");
		return;
	}
	if(title==bugs[curid].title&&content==bugs[curid].content&&comment.length==0&&priority==bugs[curid].priority){
		alert("没有修改任何内容");
		return;
	}
	let xhr= new XMLHttpRequest();
	xhr.open('POST',"edit?utf8",true);
	let url="bug="+curid+"&token="+token;
	if(title!=bugs[curid].title)
		url+="&title="+encodeURI(title);
	else
		url+="&title=";
	if(content!=bugs[curid].content)
		url+="&content="+encodeURI(content);
	if(priority!=bugs[curid].priority)
		url+="&priority="+priority;
	if(comment.length>0)
		url+="&comment="+encodeURI(comment);
	xhr.send(url);
	xhr.onreadystatechange=function(){
		if(xhr.readyState!=4 || xhr.status!=200)
			return;
		let data=xhr.responseText;
		if(data.length==0)
			return backLogin();
		document.getElementById("edit").close();
		getBugList();
	};
}
function assignShow(id,activate){
	curid=id;
	isActivate=activate;
	let title=document.getElementById("assign_title");
	if(activate)
		title.innerHTML="激活：";
	else
		title.innerHTML="指派：";
	title.innerHTML+=bugs[id].title;
	let assign=document.getElementById("assign_assign");
	assign.selectedIndex=0;
	if(!activate){
		for(let i=0;i<assign.options.length;++i){
			if(assign.options[i].value==bugs[id].assignee){
				assign.selectedIndex=i;
				break;
			}
		}
	}
	document.getElementById("assign_comment").value="";
	document.getElementById("assign").showModal();
}
function assignSubmit(){
	let assign=document.getElementById("assign_assign").value;
	let comment=document.getElementById("assign_comment").value;
	let xhr= new XMLHttpRequest();
	xhr.open('POST',(isActivate?"activate":"assign")+"?utf8",true);
	let url="bug="+curid+"&assign="+assign+"&comment="+encodeURI(comment)+"&token="+token;
	xhr.send(url);
	xhr.onreadystatechange=function(){
		if(xhr.readyState!=4 || xhr.status!=200)
			return;
		let data=xhr.responseText;
		if(data.length==0)
			return backLogin();
		document.getElementById("assign").close();
		getBugList();
	};
}
function resolveShow(id){
	curid=id;
	document.getElementById("resolve_title").innerHTML="解决："+bugs[id].title;
	let assign=document.getElementById("resolve_assign");
	assign.selectedIndex=0;
	for(let i=0;i<assign.options.length;++i){
		if(assign.options[i].value==bugs[id].creater){
			assign.selectedIndex=i;
			break;
		}
	}
	document.getElementById("resolve_type").selectedIndex=0;
	document.getElementById("resolve_comment").value="";
	document.getElementById("resolve").showModal();
}
function resolveSubmit(){
	let assign=document.getElementById("resolve_assign").value;
	let type=document.getElementById("resolve_type").value;
	let comment=document.getElementById("resolve_comment").value;
	let xhr= new XMLHttpRequest();
	xhr.open('POST',"resolve?utf8",true);
	let url="bug="+curid+"&type="+type+"&assign="+assign+"&comment="+encodeURI(comment)+"&token="+token;
	xhr.send(url);
	xhr.onreadystatechange=function(){
		if(xhr.readyState!=4 || xhr.status!=200)
			return;
		let data=xhr.responseText;
		if(data.length==0)
			return backLogin();
		document.getElementById("resolve").close();
		getBugList();
	};
}
function closeShow(id){
	curid=id;
	document.getElementById("close_title").innerHTML="关闭："+bugs[id].title;
	document.getElementById("close_comment").value="";
	document.getElementById("close").showModal();
}
function closeSubmit(){
	let comment=document.getElementById("close_comment").value;
	let xhr= new XMLHttpRequest();
	xhr.open('POST',"close?utf8",true);
	let url="bug="+curid+"&comment="+encodeURI(comment)+"&token="+token;
	xhr.send(url);
	xhr.onreadystatechange=function(){
		if(xhr.readyState!=4 || xhr.status!=200)
			return;
		let data=xhr.responseText;
		if(data.length==0)
			return backLogin();
		document.getElementById("close").close();
		getBugList();
	};
}
function getUserName(id){
	if(users[id]==undefined)
		return id;
	return users[id];
}
window.onload=function(){
	let maininfo=decodeURIComponent(localStorage.getItem("maininfo"));
	if(maininfo=='null'){
		return backLogin();
	}
	let jsmaininfo=window.JSON.parse(maininfo);
	document.title=jsmaininfo.title;
	token=jsmaininfo.token;
	let projects=document.getElementById('projects');
	jsmaininfo.projects.forEach(element=>{
		let option=document.createElement("OPTION");
		option.value=element.id;
		option.text=element.name;
		projects.options.add(option);
	});
	let create_assign=document.getElementById("create_assign");
	let resolve_assign=document.getElementById("resolve_assign");
	let assign_assign=document.getElementById("assign_assign");
	jsmaininfo.users.forEach(element=>{
		users[element.id]=element.name;
		let option=document.createElement("OPTION");
		option.value=element.id;
		option.text=element.name;
		create_assign.options.add(option);
		option=document.createElement("OPTION");
		option.value=element.id;
		option.text=element.name;
		resolve_assign.options.add(option);
		option=document.createElement("OPTION");
		option.value=element.id;
		option.text=element.name;
		assign_assign.options.add(option);
	});
	let resolve_type=document.getElementById("resolve_type");
	for(let i=2;i<stateNames.length;++i){
		let option=document.createElement("OPTION");
		option.value=i;
		option.text=stateNames[i];
		resolve_type.options.add(option);
	}
	let lastProject=localStorage.getItem("project");
	if(lastProject!=undefined)
		projects.value=lastProject;
		projects.onchange=function(){
		getBugList(1);
		localStorage.setItem("project",this.value);
	};
	if(projects.selectedIndex<0)
		projects.selectedIndex=0;
	page=1;
	getBugList();
}
</script>
</body>
</html>